<script setup>
import DashCardView from '@/components/DashCardView.vue';
import { useRouter } from 'vue-router'
import { getDashTotalService } from '@/apis/dashboard'
import { onMounted,ref } from 'vue'
const router = useRouter()
const navList = ref([])
const getDashTotal = async () => {
  navList.value = router.options.routes[0].children.filter(item => item.path !== '/dashboard')
  const res = await getDashTotalService()
  navList.value.map(v => {
    v.value = res.data[v.name] // 数组对象[v.name]找到对应的键->值
  })
  console.log(navList);
}
onMounted(() => {
  getDashTotal()
})
</script>
<template>
  <div class="header">
    <ul>
      <li v-for="item in navList" :key="item.path">
        <DashCardView :item="item"></DashCardView>
      </li>
    </ul>
  </div>
</template>
<style scoped lang="scss">
ul {
  display: flex;
  justify-content: space-between;

  li {
    width: 24%;
    margin-top: 10px;
  }
}
</style>
